<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<style>
		ul{
				width:300px;
				height:500px;
				background:red;
		}
	</style>
</head>
<body>
	<ul>
		<li>111</li>
		<li>222</li>
		<li>333</li>
		<li>444</li>
	</ul>

	<script>
		//event:事件对象 ==> 触发某个事件处理程序时,浏览器返回一个事件对象
		//事件对象提供的三个属性:
		//target: 事件源 (在谁身上触发事件指得就是谁)
		//currentTarget 事件源的原元素(绑定事件的元素)
		//type:事件类型 
		var ul = document.querySelector('ul');
		ul.onclick = function(event){
			var e = event || window.event; //事件对象的兼容处理
			if(e.target.nodeName === 'LI'){
				alert(e.target.innerHTML);
			}
		}


		btn.onclick = function(event){
 
		}
	</script>
</body>
</html>